<template>
  <div id="app">
    <router-view v-if="isRouterAlive"></router-view>
  </div>
</template>

<script>
export default {
  name: 'app',
  components: {},
  provide () {    //父组件中通过provide来提供变量，在子组件中通过inject来注入变量。                                             
	  return {
		  reload: this.reload                                              
	  }
  },
  data() {
	  return{
		  isRouterAlive: true                    //控制视图是否显示的变量
	  }
  },
  methods: {
	  reload () {
		  this.isRouterAlive = false;            //先关闭，
		  this.$nextTick(function () {
			  this.isRouterAlive = true;         //再打开
		  }) 
	  }
  },
}
</script>

<style lang="scss">
// 引入初始化样式
@import '@/style/main.scss';
@import '@/style/base.scss';
#app {
  background: #eee;
  height: 100vh;
  overflow: hidden;
}
</style>
